<template>
  <div class="page-container">
      <el-row>
        <!--工具栏-->
        <div class="toolbar" style="float:left;padding-top:10px;padding-left:15px;">
          <el-form :inline="true" :model="filters" :size="size">
            <el-form-item>
              <el-date-picker
                v-model="filters.dateTime"
                type="daterange"
                align="right"
                unlink-panels
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :picker-options="pickerOptions">
              </el-date-picker>
            </el-form-item>
            <el-form-item>
              <el-select v-model="filters.warningType" clearable placeholder="预警类型">
                <el-option label="平台预警" value="3"></el-option>
                <el-option label="商家预警" value="4"></el-option>
              </el-select>
            </el-form-item>
            <!-- 按钮 -->
            <el-form-item>
              <kt-button
                icon="fa fa-search"
                :label="$t('action.search')"
                type="primary"
                @click="findPage(null)"/>
            </el-form-item>
            <el-form-item>
              <kt-button icon="fa fa-refresh" :label="$t('action.reset')" type="primary" @click="resetForm('filters')" />
            </el-form-item>
            <el-form-item>
              <el-button type="primary" icon="el-icon-search" @click="seachRules">查看红线规则</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-row>
      <el-row>
        <el-tabs v-model="activeName" @tab-click="handleClick">
          <el-tab-pane label="触犯红线" name="first"></el-tab-pane>
          <el-tab-pane label="触犯警戒线" name="second"></el-tab-pane>
        </el-tabs>
        <!--表格内容栏-->
        <cy-table
          :height="350"
          :highlightCurrentRow="true"
          :data="pageResult"
          :columns="filterColumns"
          :showBatchDelete="false"
          :showDeleteOperation="false"
          :showEditOperation="false"
          :showSelection="false"
          :showOperation="false"
          @findPage="findPage"
          ref="CyTable">
        </cy-table>
      </el-row>
      <!--新增编辑界面-->
      <el-dialog
        width="60%"
        top="10vh"
        :visible.sync="editDialogVisible"
        :close-on-click-modal="false">
        <el-form :inline="true" :model="filters1" :size="size">
          <el-form-item>
            <el-select v-model="filters1.effectiveOrganization" clearable placeholder="生效组织">
              <el-option label="平台" value="平台"></el-option>
              <el-option label="商家" value="商家"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item>
            <el-select v-model="filters1.index" clearable placeholder="指标">
              <el-option label="售后订单率" value="1"></el-option>
              <el-option label="成交金额	" value="2"></el-option>
              <el-option label="成交订单数" value="3"></el-option>
              <el-option label="成交转化率" value="4"></el-option>
              <el-option label="PV" value="5"></el-option>
              <el-option label="UV" value="6"></el-option>
              <el-option label="商详页UV" value="7"></el-option>
              <el-option label="新客数	" value="8"></el-option>
              <el-option label="滞销品数" value="9"></el-option>
              <el-option label="沉默率" value="10"></el-option>
              <el-option label="流失率" value="11"></el-option>
              <el-option label="成交客户数" value="12"></el-option>
              <el-option label="成交商品数" value="13"></el-option>
              <el-option label="二跳率" value="14"></el-option>
            </el-select>
          </el-form-item>
          <!-- 按钮 -->
          <el-form-item>
            <kt-button
              icon="fa fa-search"
              :label="$t('action.search')"
              type="primary"/>
          </el-form-item>
          <el-form-item>
            <kt-button icon="fa fa-refresh" :label="$t('action.reset')" type="primary" @click="resetForm1('filters1')" />
          </el-form-item>
        </el-form>
        <el-button type="primary" size="small" style="float: left" @click="toggleSelection()">批量启用</el-button>
        <el-table
          :data="tableData"
          @selection-change="handleSelectionChange"
          style="width:100%;"
          :size="size"
          :default-sort = "{prop: 'effectiveOrganization', order: 'descending'}"
          :header-cell-style="{ 'color': '#FFF','background-color': '#2F4554'}">
          <el-table-column  type="selection" label="全选" width="50"></el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <el-button type="mini" icon="el-icon-edit" @click="handleRule(scope.row)">编辑</el-button>
            </template>
          </el-table-column>
          <el-table-column prop="effectiveOrganization" label="生效组织" sortable>
          </el-table-column>
          <el-table-column prop="index" label="指标" sortable>
            <template slot-scope="scope">
              {{ scope.row.index }}
              <el-switch
                active-color="#2F4554"
                inactive-color="#F56C6C"
                v-model="scope.row.enabled"
                @change="changeEnabled(scope.row, scope.row.enabled)"/>
            </template>
          </el-table-column>
          <el-table-column label="预警值">
              <el-table-column prop="settingValue" label="警戒线指标设置值" sortable></el-table-column>
              <el-table-column prop="indexValue" label="红线指标指标值" sortable></el-table-column>
          </el-table-column>
          <el-table-column prop="alertMailbox" label="预警邮箱" sortable></el-table-column>
        </el-table>
        <el-pagination
          layout="total, prev, pager, next, jumper,sizes"
          :total="10"
          style="float:right;"
          :page-sizes="[10, 20, 30, 40]"
        ></el-pagination>
        <div slot="footer" class="dialog-footer" style="text-align:center">
        <el-button :size="size" @click.native="editDialogVisible = false">{{$t('action.cancel')}}</el-button>
        <el-button
          :size="size"
          type="primary"
          @click.native="submitForm"
          :loading="editLoading"
        >{{$t('action.submit')}}</el-button>
      </div>
      </el-dialog>
      <el-dialog
      width="30%"
      top="25vh"
      :visible.sync="editDialogVisible1"
      :close-on-click-modal="false">
        <el-form
          :model="dataForm"
          label-width="120px"
          :rules="dataFormRules"
          ref="dataForm"
          :size="size">
      <el-form-item label="指标" prop="ruleId" >
        <el-input v-model="dataForm.index1" :disabled="true" auto-complete="off"></el-input>
      </el-form-item>
      <el-form-item label="警戒线规则设置" prop="priority">
        <el-input v-model="dataForm.index2" auto-complete="off" :min="1" style="width: 30%"></el-input>
      </el-form-item>
      <el-form-item label="红线规则设置" prop="ruleId">
        <el-input v-model="dataForm.index3"  auto-complete="off" :min="1" style="width: 30%"></el-input>
      </el-form-item>
      <el-form-item label="当指标高于" prop="ruleId">
        <el-input v-model="dataForm.index3" :disabled="true" auto-complete="off"></el-input>
      </el-form-item>
      <el-form-item label="发送邮件至" prop="ruleId">
        <el-input v-model="dataForm.index4" auto-complete="off"></el-input>
      </el-form-item>
        </el-form>
      <div slot="footer" class="dialog-footer" style="text-align:center">
        <el-button :size="size" @click.native="editDialogVisible1 = false">{{$t('action.cancel')}}</el-button>
        <el-button
          :size="size"
          type="primary"
          @click.native="submitForm1"
          :loading="editLoading"
        >{{$t('action.submit')}}</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import CyTable from "@/views/Core/CyTable";
  import KtButton from "@/views/Core/KtButton";
  import { format } from "@/utils/datetime";
  import TableColumnFilterDialog from "@/views/Core/TableColumnFilterDialog";
  export default {
    components: {
      KtButton,
      CyTable,
      TableColumnFilterDialog
    },
    data() {
      return {
        size: "small",
        activeName:"first",
        multipleSelection: [],
        filters1: {
          effectiveOrganization:"",
          index:""
        },
        filters: {
          dateTime: "",
          warningType: "",
          res:{
            "total": 1,
            "code": "0000",
            "rows": [{
              "id": null,
              "dataDt": "1577203200000",
              "parentMerchantCode": null,
              "parentMerchantName": null,
              "merchantCode": null,
              "merchantName": "",
              "indicator": null,
              "totalFoulNum": null,
              "parentMerchantId": null,
              "merchantId": -1,
              "companyId": 276,
              "storeId": -1,
              "companyName": null,
              "platformName": "平台",
              "storeName": "",
              "redNum": 7,
              "alertNum": 7,
              "warningMailbox": "tanqianqian@odianyun.com",
              "settingRole": 1,
              "effectiveRole": 1,
              "indicatorCode": null,
              "indicatorValueStr": "<div>成交订单数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1000</span></span></div><div>成交商品数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1</span></span></div><div>PV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1000</span></span></div><div>UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-200</span></span></div><div>商详页UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-2000</span></span></div><div>新客数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-200</span></span></div><div>成交客户数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1000</span></span></div>",
              "difference": null,
              "dataType": null,
              "indicatorValue": null,
              "indicatorName": null,
              "dataDtStr": "2019-12-25",
              "redLineValue": null,
              "redLineValueStr": null,
              "superIndexList": null
              }]
          }
        },
        columns: [
          {prop: "dataDtStr", label: "日期", minWidth: 50},
          {prop: "platformName", label: "平台名称", minWidth: 120},
          {prop: "indicatorValueStr", label: "指标", minWidth: 120,
            formatter: function (row, column, prop) {
              return prop;
            }
          },
          {prop: "redNum", label: "日累计次数", minWidth: 120}
        ],
        pickerOptions: {
          shortcuts: [{
            text: '最近一周',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit('pick', [start, end]);
            }
          }, {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit('pick', [start, end]);
            }
          }]
        },
        pageRequest: {pageNum: 1, pageSize: 10},
        pageResult: {},
        filterColumns: [],
        editLoading: false,
        operation: false, // true:新增, false:编辑
        editDialogVisible: false, // 新增编辑界面是否显示
        editDialogVisible1: false,
        dataFormRules: {
          index2: [{required: true, message: "请输入警戒线规则设置", trigger: "blur"}],
          index3: [{required: true, message: "请输入红线规则设置", trigger: "blur"}],
          index4: [{required: true, message: "请输入邮件", trigger: "blur"}],
        },
        // 新增编辑界面数据
        dataForm: {
          index1: "",
          index2: "",
          index3: "",
          index4: ""
        },
        tableData: [{
          effectiveOrganization: '平台',
          index: '售后订单率',
          settingValue: '3.00%',
          indexValue: '5.00%',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '成交金额',
          settingValue: '200000.00元',
          indexValue: '100000.00元',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '成交订单数',
          settingValue: '2000.00',
          indexValue: '1000.00',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '成交转化率',
          settingValue: '3.00%',
          indexValue: '5.00%',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: 'PV',
          settingValue: '2000.00',
          indexValue: '1000.0',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: 'UV',
          settingValue: '500.00',
          indexValue: '200.00',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '商详页UV',
          settingValue: '3000.00',
          indexValue: '2000.0',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '新客数',
          settingValue: '3.00%',
          indexValue: '5.00%',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '滞销品数',
          settingValue: '3.00%',
          indexValue: '5.00%',
          alertMailbox: 'test@163.com'
        },{
          effectiveOrganization: '平台',
          index: '沉默率',
          settingValue: '3.00%',
          indexValue: '5.00%',
          alertMailbox: 'test@163.com'
        }],
        checkbox: []
      };
    },
    mounted() {
      this.initColumns();
    },
    methods: {
      handleSelectionChange(val) {
        this.checkbox = val;
      },
      toggleSelection(data) {
        if (this.checkbox.length === 0) {
          this.$message({
            message: '请选择预警指标!',
            type: 'warning'
          });
        } else {
          this.$message({
            message: '操作失败!',
            type: 'success'
          });
        }
      },
      handleClick(tab, event) {
        if (tab.name === "first") {
          this.filters= {
            res:{
              "total": 1,
                "code": "0000",
                "rows": [{
                "id": null,
                "dataDt": "1577203200000",
                "parentMerchantCode": null,
                "parentMerchantName": null,
                "merchantCode": null,
                "merchantName": "",
                "indicator": null,
                "totalFoulNum": null,
                "parentMerchantId": null,
                "merchantId": -1,
                "companyId": 276,
                "storeId": -1,
                "companyName": null,
                "platformName": "平台",
                "storeName": "",
                "redNum": 7,
                "alertNum": 7,
                "warningMailbox": "tanqianqian@odianyun.com",
                "settingRole": 1,
                "effectiveRole": 1,
                "indicatorCode": null,
                "indicatorValueStr": "<div>成交订单数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1000</span></span></div><div>成交商品数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1</span></span></div><div>PV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1000</span></span></div><div>UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-200</span></span></div><div>商详页UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-2000</span></span></div><div>新客数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-200</span></span></div><div>成交客户数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: red;'></i><span style='color:red;'>&nbsp;&nbsp;-1000</span></span></div>",
                "difference": null,
                "dataType": null,
                "indicatorValue": null,
                "indicatorName": null,
                "dataDtStr": "2019-12-25",
                "redLineValue": null,
                "redLineValueStr": null,
                "superIndexList": null
              }]
            }
          },
          this.initColumns();
          this.findPage(this.filters);
        } else {
          this.filters = {
            res: {
              "total": 2,
              "code": "0000",
              "rows": [{
                "id": null,
                "dataDt": 1577203200000,
                "parentMerchantCode": null,
                "parentMerchantName": null,
                "merchantCode": null,
                "merchantName": "",
                "indicator": null,
                "totalFoulNum": null,
                "parentMerchantId": null,
                "merchantId": -1,
                "companyId": 276,
                "storeId": -1,
                "companyName": null,
                "platformName": "平台",
                "storeName": "",
                "redNum": 7,
                "alertNum": 7,
                "warningMailbox": "tanqianqian@odianyun.com",
                "settingRole": 1,
                "effectiveRole": 1,
                "indicatorCode": null,
                "indicatorValueStr": "<div>UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-200</span></span></div>\n" +
                  "    <div>商详页UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-300</span></span></div>\n" +
                  "    <div>新客数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-300</span></span></div>\n" +
                  "    <div>成交客户数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2000</span></span></div>\n" +
                  "    <div>PV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2000</span></span></div>\n" +
                  "    <div>成交订单金额&nbsp;&nbsp;0.00元<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-200000.00元</span></span></div>\n" +
                  "    <div>成交订单数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-200</span></span></div>\n" +
                  "    <div>成交商品数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2</span></span></div>",
                "difference": null,
                "dataType": null,
                "indicatorValue": null,
                "indicatorName": null,
                "dataDtStr": "2019-12-25",
                "redLineValue": null,
                "redLineValueStr": null,
                "superIndexList": [
                  {
                    "id": 162,
                    "dataDt": 1577203200000,
                    "parentMerchantCode": null,
                    "parentMerchantName": null,
                    "merchantCode": null,
                    "merchantName": "",
                    "indicator": null,
                    "totalFoulNum": null,
                    "parentMerchantId": null,
                    "merchantId": -1,
                    "companyId": 276,
                    "storeId": -1,
                    "companyName": null,
                    "platformName": null,
                    "storeName": "",
                    "redNum": null,
                    "alertNum": null,
                    "warningMailbox": "tanqianqian@odianyun.com",
                    "settingRole": 1,
                    "effectiveRole": 1,
                    "indicatorCode": "pay_order_num",
                    "indicatorValueStr": null,
                    "difference": -2000.00,
                    "dataType": 4,
                    "indicatorValue": 0.00,
                    "indicatorName": "成交订单数",
                    "dataDtStr": null,
                    "redLineValue": null,
                    "redLineValueStr": null,
                    "superIndexList": null
                  },
                  {
                    "id": 163,
                    "dataDt": 1577203200000,
                    "parentMerchantCode": null,
                    "parentMerchantName": null,
                    "merchantCode": null,
                    "merchantName": "",
                    "indicator": null,
                    "totalFoulNum": null,
                    "parentMerchantId": null,
                    "merchantId": -1,
                    "companyId": 276,
                    "storeId": -1,
                    "companyName": null,
                    "platformName": null,
                    "storeName": "",
                    "redNum": null,
                    "alertNum": null,
                    "warningMailbox": "tanqianqian@odianyun.com",
                    "settingRole": 1,
                    "effectiveRole": 1,
                    "indicatorCode": "pay_order_mp_num",
                    "indicatorValueStr": null,
                    "difference": -2.00,
                    "dataType": 4,
                    "indicatorValue": 0.00,
                    "indicatorName": "成交商品数",
                    "dataDtStr": null,
                    "redLineValue": null,
                    "redLineValueStr": null,
                    "superIndexList": null
                  },]
              },{
                "id": null,
                "dataDt": 1577203200000,
                "parentMerchantCode": null,
                "parentMerchantName": null,
                "merchantCode": null,
                "merchantName": "",
                "indicator": null,
                "totalFoulNum": null,
                "parentMerchantId": null,
                "merchantId": -1,
                "companyId": 276,
                "storeId": -1,
                "companyName": null,
                "platformName": "平台",
                "storeName": "",
                "redNum": 7,
                "alertNum": 7,
                "warningMailbox": "tanqianqian@odianyun.com",
                "settingRole": 1,
                "effectiveRole": 1,
                "indicatorCode": null,
                "indicatorValueStr": "<div>UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-500</span></span></div><div>商详页UV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-3000</span></span></div><div>新客数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-300</span></span></div><div>成交客户数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2000</span></span></div><div>PV&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2000</span></span></div><div>成交订单金额&nbsp;&nbsp;0.00元<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-200000.00元</span></span></div><div>成交订单数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2000</span></span></div><div>成交商品数&nbsp;&nbsp;0.00<span style='position: sticky;left: 160px;'><i class='el-icon-caret-top' style='margin: 5px;color: orange;'></i><span style='color:orange;'>&nbsp;&nbsp;-2</span></span></div>",
                "difference": null,
                "dataType": null,
                "indicatorValue": null,
                "indicatorName": null,
                "dataDtStr": "2019-12-25",
                "redLineValue": null,
                "redLineValueStr": null,
                "superIndexList": [
                  {
                    "id": 162,
                    "dataDt": 1577203200000,
                    "parentMerchantCode": null,
                    "parentMerchantName": null,
                    "merchantCode": null,
                    "merchantName": "",
                    "indicator": null,
                    "totalFoulNum": null,
                    "parentMerchantId": null,
                    "merchantId": -1,
                    "companyId": 276,
                    "storeId": -1,
                    "companyName": null,
                    "platformName": null,
                    "storeName": "",
                    "redNum": null,
                    "alertNum": null,
                    "warningMailbox": "tanqianqian@odianyun.com",
                    "settingRole": 1,
                    "effectiveRole": 1,
                    "indicatorCode": "pay_order_num",
                    "indicatorValueStr": null,
                    "difference": -2000.00,
                    "dataType": 4,
                    "indicatorValue": 0.00,
                    "indicatorName": "成交订单数",
                    "dataDtStr": null,
                    "redLineValue": null,
                    "redLineValueStr": null,
                    "superIndexList": null
                  },
                  {
                    "id": 163,
                    "dataDt": 1577203200000,
                    "parentMerchantCode": null,
                    "parentMerchantName": null,
                    "merchantCode": null,
                    "merchantName": "",
                    "indicator": null,
                    "totalFoulNum": null,
                    "parentMerchantId": null,
                    "merchantId": -1,
                    "companyId": 276,
                    "storeId": -1,
                    "companyName": null,
                    "platformName": null,
                    "storeName": "",
                    "redNum": null,
                    "alertNum": null,
                    "warningMailbox": "tanqianqian@odianyun.com",
                    "settingRole": 1,
                    "effectiveRole": 1,
                    "indicatorCode": "pay_order_mp_num",
                    "indicatorValueStr": null,
                    "difference": -2.00,
                    "dataType": 4,
                    "indicatorValue": 0.00,
                    "indicatorName": "成交商品数",
                    "dataDtStr": null,
                    "redLineValue": null,
                    "redLineValueStr": null,
                    "superIndexList": null
                  },]
              }]
            }
          };
          this.initColumns();
          this.findPage(this.filters);
        }
      },
      // 获取分页数据
      findPage: function (data) {
        this.$refs.CyTable.findPageStaticState(this.filters);
      },
      // 批量删除
      handleDelete: function (data) {
        this.$message({
          message: '操作成功',
          type: 'success'
        });
      },
      // 查看红线规则
      seachRules() {
        this.editDialogVisible = true;
      },
      handleRule(data) {
        this.editDialogVisible1 = true;
        this.dataForm.index1 = data.index;
        this.dataForm.index2 = data.effectiveOrganization;
        this.dataForm.index3 = data.indexValue;
        this.dataForm.index3 = data.indexValue;
        this.dataForm.index4 = data.alertMailbox;
      },
      submitForm() {
        this.$message({
          message: '操作成功!',
          type: 'success'
        });
        this.editDialogVisible = false;
      },
      submitForm1() {
        this.$message({
          message: '操作成功!',
          type: 'success'
        });
        this.editDialogVisible1 = false;
      },
      // 改变状态
      changeEnabled(data, val) {
        this.$confirm('此操作将   ' + (val ? '启用' : '停用') + ' ，是否继续？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
        }).catch(() => {
          data.enabled = !data.enabled
        });
      },
      // 时间格式化
      dateFormat: function(row, column, cellValue, index) {
        return format(row[column.property]);
      },
      // 重置
      resetForm1(formName) {
        this.filters1 = {
          index: "",
          effectiveOrganization:""
        };
      },
      resetForm(formName) {
        this.filters = {
          warningType:"",
          dateTime:"",
        };
      },
      // 处理表格列过滤显示
      displayFilterColumnsDialog: function () {
        this.$refs.tableColumnFilterDialog.setDialogVisible(true)
      },
      handleFilterColumns: function (data) {
        this.filterColumns = data.filterColumns
        this.$refs.tableColumnFilterDialog.setDialogVisible(false)
      },
      initColumns: function () {
        var temp = [];
        $.each(this.columns, function (key, val) {
          temp.push(val)
        })
        this.filterColumns = temp;
      },
    }
  };
</script>

<style scoped>
  .el-icon-caret-top
  {
    padding: 0px;
    font-size: 20px;
    color: red;
  }
</style>
